import 'package:cbec_app/components/base/base_image.dart';
import 'package:cbec_app/components/base/base_interactive.dart';
import 'package:cbec_app/routes/routes.dart';
import 'package:cbec_app/utils/Tools.dart';
import 'package:cbec_app/utils/logger.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter/widgets.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:get/get.dart';

///店铺装修-魔方
class DecorationMagicCube extends StatefulWidget {
  ///魔方配置
  final Map<String, dynamic> info;

  const DecorationMagicCube({super.key, required this.info});

  @override
  State<StatefulWidget> createState() {
    return _DecorationMagicCubeState();
  }
}

class _DecorationMagicCubeState extends State<DecorationMagicCube> {
  @override
  void initState() {
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    print('魔方 ---- ${widget.info}');
    return getBox();
  }

  ///获取容器
  Widget getBox() {
    switch (widget.info['show_method']) {
      case 7: //固定宽高
        return Container(width: getUseWidth(0), height: getUseWidth(0), margin: EdgeInsets.only(left: getPagePadding(), right: getPagePadding()), child: getStyle());
      default: //自动宽高
        return Container(margin: EdgeInsets.only(left: getPagePadding(), right: getPagePadding()), child: getStyle());
    }
  }

  ///获取页面间距
  double getPagePadding() {
    return double.parse(widget.info['page_margin'].toString());
  }

  ///获取图片间距
  double getImgPadding() {
    return (widget.info['border_width'] as int).toDouble();
  }

  ///魔方布局
  Widget getStyle() {
    switch (widget.info['show_method']) {
      case 1: //一行三个
        return Row(mainAxisAlignment: MainAxisAlignment.spaceBetween, children: (widget.info['sub_entry'] as List).map((item) => cubeItem(item, getUseWidth(2) / 3)).toList());
      case 2: //一行4个
        return Row(mainAxisAlignment: MainAxisAlignment.spaceBetween, children: (widget.info['sub_entry'] as List).map((item) => cubeItem(item, getUseWidth(3) / 4)).toList());
      case 3: //二左二右
        return Wrap(
          alignment: WrapAlignment.spaceBetween,
          runSpacing: getImgPadding(),
          children: (widget.info['sub_entry'] as List).map((item) => cubeItem(item, getUseWidth(1) / 2, height: getUseWidth(1) / 2)).toList(),
        );
      case 4: //一左两右
        return Row(
          mainAxisAlignment: MainAxisAlignment.spaceBetween,
          children: [
            cubeItem(widget.info['sub_entry'][0], getUseWidth(1) / 2, height: getUseWidth(1)),
            Column(
              mainAxisAlignment: MainAxisAlignment.start,
              children: [
                cubeItem(widget.info['sub_entry'][1], getUseWidth(1) / 2, height: getUseWidth(1) / 2),
                SizedBox(
                  height: getImgPadding(),
                ),
                cubeItem(widget.info['sub_entry'][2], getUseWidth(1) / 2, height: getUseWidth(1) / 2),
              ],
            )
          ],
        );
      case 5: //一上二下
        return Column(
          children: [
            cubeItem(widget.info['sub_entry'][0], getUseWidth(0), height: getUseWidth(0) / 2),
            Row(
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              children: [
                cubeItem(widget.info['sub_entry'][1], getUseWidth(0) / 2, height: getUseWidth(0) / 4),
                cubeItem(widget.info['sub_entry'][2], getUseWidth(0) / 2, height: getUseWidth(0) / 4),
              ],
            )
          ],
        );
      case 6: //一左三右
        return Row(
          mainAxisAlignment: MainAxisAlignment.spaceBetween,
          children: [
            cubeItem(widget.info['sub_entry'][0], getUseWidth(1) / 2, height: getUseWidth(1)),
            Column(
              mainAxisAlignment: MainAxisAlignment.start,
              children: [
                cubeItem(widget.info['sub_entry'][1], getUseWidth(1) / 2, height: getUseWidth(1) / 2),
                SizedBox(
                  width: getUseWidth(1) / 2,
                  height: getImgPadding(),
                ),
                Row(
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  children: [
                    cubeItem(widget.info['sub_entry'][2], getUseWidth(1) / 4, height: getUseWidth(1) / 4),
                    cubeItem(widget.info['sub_entry'][3], getUseWidth(1) / 4, height: getUseWidth(1) / 4),
                  ],
                )
              ],
            )
          ],
        );
      case 7: //自定义
        return Stack(
          children: (widget.info['sub_entry'] as List).map((item) => customCubeItem(item)).toList(),
        );
      case 0: //一行两个
      default:
        return Row(mainAxisAlignment: MainAxisAlignment.spaceBetween, children: (widget.info['sub_entry'] as List).map((item) => cubeItem(item, getUseWidth(1) / 2)).toList());
    }
  }

  ///普通魔方item
  Widget cubeItem(Map<String, dynamic> item, double width, {double? height}) {
    print('cubeItem ==== link_type ${item['link_type'].runtimeType}');
    print('cubeItem ==== link_id ${item['link_id'].runtimeType}');
    return BaseInteractive(
      childWidget: BaseImage(url: item['image_url'], width: width, height: height),
      onClick: () {
        item['link_id'] = item['link_id'];
        Tools.jumpPage(item);
      },
    );
  }

  ///自定义魔方item
  Widget customCubeItem(Map<String, dynamic> item) {
    return Positioned(top: getPerWH() * item['top'], left: getPerWH() * item['left'], child: cubeItem(item, getCustomWidth(item), height: getCustomHeight(item)));
  }

  ///获取魔方每份宽高
  double getPerWH() {
    return getUseWidth(0) / widget.info['layout'];
  }

  ///获取自定义魔方宽度
  double getCustomWidth(Map<String, dynamic> item) {
    return getPerWH() * item['width'] - getImgPadding() / 2;
  }

  ///获取自定义魔方高度
  double getCustomHeight(Map<String, dynamic> item) {
    return getPerWH() * item['height'] - getImgPadding() / 2;
  }

  ///获取每份图片可用宽度
  double getUseWidth(int length) {
    return 375.w - getPagePadding() * 2 - getImgPadding() * length;
  }
}
